<ul>
  {{range .TOC.Nodes}}
    <li class="mt-8 lg:mt-2">
      <h5 class="mb-4 lg:mb-3 font-semibold">
        {{if .Content}}
          <a class="block text-sky-600 dark:text-sky-500" href="{{$.Page.DocsBasePath}}/{{.Path}}">{{.Title}}</a>
        {{else}}
          <span class="text-slate-900 dark:text-slate-200">{{.Title}}</span>
        {{end}}
      </h5>
      {{if .Nodes}}
        <ul class="space-y-4 lg:space-y-2 border-l border-slate-100 dark:border-slate-800">
          {{range .Nodes}}
            <li>
              {{if eq $.Current .Path}}
                <a class="block border-l pl-4 -ml-px text-sky-500 border-current font-semibold dark:text-sky-400" href="{{$.Page.DocsBasePath}}/{{.Path}}">
                  {{.Title}}
                </a>
              {{else}}
                <a class="block border-l pl-4 -ml-px border-transparent hover:border-slate-400 dark:hover:border-slate-500 text-slate-700 hover:text-slate-900 dark:text-slate-400 dark:hover:text-slate-300" href="{{$.Page.DocsBasePath}}/{{.Path}}">
                  {{.Title}}
                </a>
              {{end}}
            </li>
          {{end}}
        </ul>
      {{end}}
    </li>
  {{end}}
</ul>
